<template>
	<view class="page-fade-in" :style="{opacity: pageOpc}">
		<template v-if="pageOpc">
			<view class="content">
				<view class="work-box">
					<view class="title-box">
						提问信息
					</view>
					<view class="work-cont">
						<view class="work-item flexWrapNo">
							<view class="work-title">问题：</view>
							<view class="work-text">有抖音官方人员联系我上抖音共享团单，这个活动是否可以参加？</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">问题类型：</view>
							<view class="work-text">美团/抖音问题</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">问题时间：</view>
							<view class="work-text">2023-10-12 12:31:32</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">提交人：</view>
							<view class="work-text">wangdalei</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">所属店铺：</view>
							<view class="work-text">摸鱼乒乓球-爱琴海店</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">附件：</view>
							<view class="attachment-box flexWrapNo">
								<image  @tap="previewImage(item,attachmentImg)" class="attachment-img" v-for="item in attachmentImg" :src="item"></image>
							</view>
						</view>
					</view>
				</view>
				<view class="work-box">
					<view class="title-box">
						受理信息
					</view>
					<view class="work-cont">
						<view class="work-item flexWrapNo">
							<view class="work-title">受理人：</view>
							<view class="work-text">wangdalei</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">受理时间：</view>
							<view class="work-text">2023-10-12 12:31:32</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">解决时间：</view>
							<view class="work-text">2023-10-12 12:31:32</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">解决方案：</view>
							<view class="work-text">有抖音官方人员联系我上抖音共享团单，这个活动是否可以参加？</view>
						</view>
						<view class="work-item flexWrapNo">
							<view class="work-title">附件：</view>
							<view class="attachment-box flexWrapNo">
								<image  @tap="previewImage(item,attachmentImg)" class="attachment-img" v-for="item in attachmentImg" :src="item"></image>
							</view>
						</view>
					</view>
				</view>
				<view class="bottom-box flexWrapNo">
					<view class="define-btn">我要投诉</view>
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageOpc: 0,
				attachmentImg:['https://static.mo-yu.vip/uploads/20231009/29ba3650e72a139930a7865521cb4086.jpg']
			}
		},
		onLoad(ops) {
			
		},
		onReady() {
			setTimeout(() => {
				this.pageOpc = 1
			}, 100)
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	.content {
		padding:36upx;
		padding-bottom: 120upx;
	}
	.work-box{
		.title-box{
			font-size: 28rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			border-bottom: 1rpx solid #36355E;
			padding-bottom: 26upx;
		}
		.work-cont{
			padding: 32upx 0;
			.work-item{
				align-items: start;
				margin-bottom: 22upx;
				.work-title{
					font-size: 28rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color:#82819B;
					line-height: 38rpx;
					min-width: 140upx;
					text-align: right;
					flex: none;
				}
				.work-text{
					font-size: 28rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
					line-height: 38rpx;
					margin-left: 12upx;
				}
				.attachment-box{
					.attachment-img{
						width: 162rpx;
						height: 162rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						margin-right: 20upx;
						:nth-of-type(3n){
							margin-right: 0;
						}
					}
				}
			}
		}
	}
	.bottom-box{
		height: 120rpx;
		background: #1D1C5C;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		justify-content: center;
		font-size: 32rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		.define-btn{
			font-size: 32rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 80rpx;
			width: 322rpx;
			height: 80rpx;
			background: #26BCFD;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			text-align: center;
		}
	}
</style>
